<template>
  <uni-popup ref="popup" type="bottom">
    <view class="bgWite">
      <view class="title flex flex-align flex-center">{{couponInfo.currency_name}}说明</view>
      <view class="colse" @click="close">
        <uni-icons type="closeempty" size="20"></uni-icons>
      </view>
      <view class="coupon">
        <view class="list">
          <view >
            <view class="titles">什么是红包券</view>
            <view class="quanList">
              <view>这里是红包券的介绍，这里是红包券的介绍这里是红
包券的介绍这里是红包券的介绍，这里是红包券的介
绍这里是红包券的介绍</view>
            </view>
          </view>
        </view>
        
      </view>
    </view>
  </uni-popup>
</template>



<script setup lang="ts">
import { onMounted, ref } from 'vue'

defineProps({
  show: {
    type: Boolean,
    default: true
  },
  couponInfo: {
    type: Object,
    default: () => ({}) 
  }
})
const emit = defineEmits(['submit', 'update:show'])
onMounted(() => {})
const popup = ref<any>(null)
async function open() {
  popup.value?.open('bottom')
  updateShow(true)
}
function close() {
  popup.value?.close()
  updateShow(false)
}

function updateShow(value: boolean) {
  emit('update:show', value)
}
defineExpose({
  open
})
</script>

<style lang="scss" scoped>
.bgWite{background: #fff;max-height: 1000rpx;border-radius: 30rpx 30rpx 0 0;position: relative;
  padding-bottom: 30rpx;
  .colse{position: absolute;right: 30rpx;top:30rpx;}
  .title{height: 80rpx;font-size: 32rpx;}
}
.coupon{
  padding: 30rpx;
  .list{padding-bottom: 10rpx;
    margin-bottom: 20rpx;
    .titles{
      font-size: 28rpx;
      margin-bottom: 30rpx;font-weight: bold;
    }
   .quanList{
      font-size: 26rpx;padding-bottom: 20rpx;background: #f7f7f7;padding: 20rpx;border-radius: 10rpx;
      color: #646566;
    }
  }
}
.red{
  color: #FE7431;font-size: 26rpx;font-weight: bold;
}
</style>
